<template>
    <div>
        <van-nav-bar :title="title" left-text="返回" left-arrow @click-left="onClickLeft" />
        <div class="attObj">
            <div class="attImg">
                <img src="../../static/images/background.gif" alt="" />
                <span>{{ route.query.source }}</span>
            </div>
            <div class="attNews">
                <h3>发布的文章</h3>
                <div class="attNewsList" @click="pathGo(item)" v-for="item in attObj.list">
                    <span class="attTitle">{{ item.title }}</span>
                    <div class="attMain">{{ item.content }}</div>
                    <span class="attTime">{{ moment(item.create_time).format("YYYY-MM-DD") }}</span>
                </div>
            </div>
        </div>
    </div>
</template>
<script setup>
import moment from "moment";
import { NavBar } from "vant";
import { useRoute, useRouter } from "vue-router";
import { onBeforeMount, reactive, ref } from "vue";
import { attentionManDetail, undateUserWeb } from "@/request/index";
import { react } from "@babel/types";
const route = useRoute();
const router = useRouter();
const onClickLeft = () => history.back();
let attObj = reactive({ list: [] });
let title = ref("");
let user_id = localStorage.getItem("token");
onBeforeMount(() => {
    title.value = route.query.source + "的主页";
    attentionManDetail({ source: route.query.source }).then((data) => {
        // console.log(data);
        attObj.list = data.row;
    });
});
const pathGo = (x) => {
    // console.log(x.id, user_id, "comment");
    router.push({ path: "/newsDetail", query: { id: x.id } });
    undateUserWeb({ user_id, comment_db: "comment", comment_id: x.id, comment: x.digest }).then((data) => {
        // console.log("undateUserWeb", data);
    });
};
</script>
<style lang="scss">
@import "../../static/style/variable.scss";
.attImg {
    height: 100px;
    background-color: $activeColor;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: column;

    padding: 10px 0;
    img {
        height: 70px;
        width: 70px;
        border-radius: 50%;
    }

    span {
        color: white;
    }
}
.attNews {
    padding: 10px;

    .attNewsList {
        margin-top: 10px;
        padding-top: 10px;
        height: 84px;
        width: 100%;
        color: white;
        background-color: rgb(95, 116, 135);
        border-radius: 10px;
        .attTitle {
            margin-left: 10px;
            display: block;
            text-overflow: ellipsis;
            overflow: hidden;
            white-space: nowrap;
        }
        .attMain {
            line-height: 16px;

            font-weight: 100;
            margin: 10px;
            margin-bottom: 0;
            height: 34px;
            font-size: 14px;
            text-overflow: -o-ellipsis-lastline;
            overflow: hidden;
            text-overflow: ellipsis;
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
        }
        .attTime {
            font-size: 12px;
            margin-left: 10px;
            font-weight: 100;
        }
    }
}
.van-nav-bar .van-icon,
.van-nav-bar__text {
    color: #576574;
}
</style>
